<template>
  
    <div class="header" >
      <div class="logo">
        <img src="../assets/image/logo.png" alt=""  class="woshitoubulogo" ><span>这是个logo</span>
      </div>
      <div  style="background-color:#078282 ;">
      <el-row class="banxinmue">
        <el-col :span="24">
         <el-menu
            :default-active="activeIndex2"
            class="el-menu-demo"
            mode="horizontal"
            @select="handleSelect"
            background-color="#078282"
            text-color="#fff"
            active-text-color="#ffd04b">
            <el-menu-item index="shouye">
              <router-link to="/home" tag="li">首页</router-link>
            </el-menu-item>
            <el-menu-item index="zhaopinxinxi">
              <router-link to="/zhaopinxinxi" tag="li">招聘信息</router-link>
              </el-menu-item>
            <el-menu-item index="feizhaobiaoxinxi">
              <router-link to="/feizhaobiaoxinxi" tag="li">非招标信息</router-link>
              </el-menu-item>
            <el-menu-item index="chuzhigonggao">
              <router-link to="/chuzhigonggao" tag="li">处置公告</router-link>
              </el-menu-item>
            <el-menu-item index="wangluogonggao">
              <router-link to="/wangluogonggao" tag="li">网络公告</router-link>
              </el-menu-item>
            <el-menu-item index="guanyuwm">
              <router-link to="/guanyuwom" tag="li">关于我们</router-link>
              </el-menu-item>
            <el-submenu index="xitongguanli">
                <template slot="title">系统管理</template>
                <el-menu-item index="111">
                   <router-link to="/xitongguanli" tag="li">选项1</router-link>
                  </el-menu-item>
                <el-menu-item index="2">
                  <router-link to="/xitongguanli" tag="li">选项2</router-link>
                  </el-menu-item>
                  <el-menu-item index="3">
                  <router-link to="/xitongguanli" tag="li">选项3</router-link>
                  </el-menu-item>
             </el-submenu>
             <el-submenu index="wode">
                <template slot="title">我的</template>
                <el-menu-item index="5">
                  <router-link to="/wode" tag="li">选项1</router-link>
                  </el-menu-item>
                  <el-menu-item index="6">
                  <router-link to="/wode" tag="li">选项2</router-link>
                  </el-menu-item>
                  <el-menu-item index="7">
                  <router-link to="/wode" tag="li">选项3</router-link>
                  </el-menu-item>
             </el-submenu>
             <el-submenu index="wyaofabu">
                <template slot="title">我要发布</template>
                <el-menu-item index="9">
                  <router-link to="/woyaofabu" tag="li">选项1</router-link>
                 </el-menu-item>
                 <el-menu-item index="10">
                  <router-link to="/woyaofabu" tag="li">选项2</router-link>
                 </el-menu-item>
                 <el-menu-item index="11">
                  <router-link to="/woyaofabu" tag="li">选项3</router-link>
                 </el-menu-item>
             </el-submenu>
         </el-menu>      
        </el-col>
       
      </el-row>
      </div>
    </div>
  
</template>

<script>
export default {
         data(){
          return{
            activeIndex2 :'shouye',
          }
         },
         methods: {
                     handleSelect(key, keyPath) {
                       console.log(key, keyPath);
                     }
          }
}
</script>

<style>
       .el-row {
    margin-bottom: 20px; }
  .el-col {
    border-radius: 4px;
  }
  .bg-purple-dark {
    background: #99a9bf;
  }
  .bg-purple {
    background: #d3dce6;
  }
  .bg-purple-light {
    background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
.woshitoubulogo{

width: 40px;
}
.header{
  background-color: #EFEFF3;
}
.logo{
  width: 1100px;
  margin: 0 auto;
  display: flex;
  align-items: center;
}
.banxinmue{
  width: 1100px;
  margin: 0 auto;
}
.el-menu.el-menu--horizontal{
  border:none ;
}
</style>